* {
	padding: 0;
	margin: 0;
}

body {
	background: #f8f8f8;
	margin: 30px;
}

 :root {
	--el-border-color-light: #e4e7ed;
	--el-box-shadow-light: 0px 0px 12px rgba(0, 0, 0, .12);
}

.pug-cardbox {
	width: 300px;
	border-radius: 3px;
	font-size: 14px;
	color: #303133;
	border: 1px solid var(--el-border-color-light);
}

.pug-cardbox-always {
	box-shadow: var(--el-box-shadow-light);
}

.pug-cardbox-hover:hover {
	box-shadow: var(--el-box-shadow-light);
}

.pug-cardbox-never {
	box-shadow: none;
}

.pug-card-title {
	padding: 18px 20px;
	border-bottom: 1px solid var(--el-border-color-light);
	display: flex;
	justify-content: space-between;
	font-size: 16px;
}

.pug-card-bold .pug-card-title {
	font-weight: bold;
}

.pug-card-body {
	padding: 18px 20px;
}

.pug-button {
	background: transparent;
	border: 0;
	padding: 4px 8px;
}

.pug-button:hover {
	background: #eee;
}

.pug-car-button{
	width: 100px;
	height: 40px;
	font-weight: bold;
}